<template>
  <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
    <el-form-item label="姓名" prop="name">
      <el-input v-model="ruleForm.name"></el-input>
    </el-form-item>

    <el-form-item label="部门">
      <el-select v-model="ruleForm.departmentid" placeholder="请选择">
        <el-option v-for="item in options" :key="item.id" :label="item.departmenName" :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="职位">
      <el-select v-model="ruleForm.positionid" placeholder="请选择">
        <el-option v-for="item in options1" :key="item.id" :label="item.position" :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="入职日期" prop="thetime">
      <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.thetime" style="width: 100%;"></el-date-picker>
    </el-form-item>

    <el-form-item label="申请日期" prop="applicationdate">
      <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.applicationdate" style="width: 100%;">
      </el-date-picker>
    </el-form-item>

    <el-form-item label="审批状态">
      <el-select v-model="ruleForm.examinationid" placeholder="请选择">
        <el-option v-for="item in options2" :key="item.id" :label="item.examination" :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="创建时间" prop="creationtime">

      <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.creationtime" style="width: 100%;">
      </el-date-picker>

    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
      <el-button @click="resetForm('ruleForm')">重置</el-button>
    </el-form-item>
  </el-form>
</template>
<script>

export default {

  data () {
    return {
      ruleForm: {
        name: "",
        departmentid: '',
        positionid: '',
        examinationid: '',
        thetime: '',

        applicationdate: '',
        creationtime: ''
      },
      rules: {
        name: [
          { required: true, message: '请输入姓名', trigger: 'blur' },
        ],
        region: [
          { required: true, message: '请选择活动区域', trigger: 'change' }
        ],
        thetime: [
          { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
        ],
        creationtime: [
          { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
        ],
        applicationdate: [
          { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
        ],
        type: [
          { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
        ],
        resource: [
          { required: true, message: '请选择活动资源', trigger: 'change' }
        ],
        desc: [
          { required: true, message: '请填写活动形式', trigger: 'blur' }
        ]
      },
      options: [],
      options1: [],
      options2: [],
    }
  },
  created () {
    this.bum();
    this.zhiwei();
    this.shepi();
  },
  methods: {

    submitForm (formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {


          this.$http({
            url: "https://localhost:44357/api/SSk/ManagementtanbleAdd",
            method: "post",
            data: this.ruleForm
          }).then((obj) => {
            alert("添加成功");
            this.$router.push('/ZhuanZhengShow');
          })


        } else {
          alert("请输入必填项");
          return false;
        }
      });
    },
    resetForm (formName) {
      this.$refs[formName].resetFields();
    },


    //添加
    updatee () {


      this.$http({
        url: "https://localhost:44357/api/SSk/ManagementtanbleAdd",
        method: "post",
        data: this.ruleForm
      }).then((obj) => {
        alert("添加成功");
        this.$router.push('/ZhuanZhengShow');
      })
    },

    //部门
    bum () {
      this.$http({
        url: "https://localhost:44357/api/SSk/buma",
        method: "get",
      }).then((obj) => {
        this.options = obj.data;
      })
    },
    //职位
    zhiwei () {
      this.$http({
        url: "https://localhost:44357/api/SSk/zhiw",
        method: "get",
      }).then((obj) => {
        this.options1 = obj.data;
      })
    },
    //审批状态
    shepi () {
      this.$http({
        url: "https://localhost:44357/api/SSk/sp",
        method: "get",
      }).then((obj) => {
        this.options2 = obj.data;
      })
    }
  }
}
</script>
